<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>第一个Ajax请求</title>
</head>
<body>
<input type="button" value="click" id="btn1"><br>
<div id="div1"></div>
<script type="text/javascript">
    window.onload = function (){
        let btn1 = document.getElementById('btn1');
        btn1.onclick = function (event) {
            event = event || window.event;
            //创建Ajax核心对象
            let ajax = new XMLHttpRequest();
            //注册回调函数，readyState发生改变后会被调用
            ajax.onreadystatechange = function (){
                //状态码会随着调用阶段改变，改变一次就会调用一次回调函数
                console.log(ajax.readyState);
                //一般结束后会有一个HTTP状态码，常见状态码：200，3xx，4xx，5xx
            }
            //打开通道,参数，请求方式，请求路径，异步还是同步（true  or false）
            ajax.open('GET','cssDemo/index.html',true);
            //发送请求
            ajax.send();
        }
    }
</script>
</body>
</html>